<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
 <head>
    <style>
        .am-tabs-default .am-tabs-nav>.am-active a {
           background-color: #EE3B3B;
           color: #fff;
           border-radius:5px;
           -webkit-border-radius:5px;
           -moz-border-radius:5px;
        }
        .am-tabs-default .am-tabs-nav a {
            background-color: #FFBBFF;
            color: #222;
            line-height: 42px;
            border-radius:5px;
            -webkit-border-radius:5px;
            -moz-border-radius:5px;
        }
    </style>        
    </head>
<body>
    <div>
        <!--中间大图-->
        <div>
            <img style="width: 100%; height: 25%" src="<?php echo Yii::app()->baseUrl?>/images/粉色萌宝方案.jpg" />  
        </div> 
  <div data-am-widget="list_news" class="am-list-news am-list-news-default" >
    <!--列表标题-->
    <div class="am-list-news-bd">
        <ul class="am-list">
           <!--缩略图在标题左边-->
            <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
              <div class="am-u-sm-4 am-list-thumb">          
                  <img src="http://img5.douban.com/lpic/o636459.jpg"/>
              </div>

              <div class=" am-u-sm-8 am-list-main">
                  <h3 class="am-list-item-hd"><a href="" class="">首届.智慧萌宝大赛</a></h3>
              </div>
            </li>
            <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
              <div class="am-u-sm-4 am-list-thumb">          
                  <img src="http://img5.douban.com/lpic/o636459.jpg"/>
              </div>

              <div class=" am-u-sm-8 am-list-main">
                  <h3 class="am-list-item-hd"><a href="" class="">首届.智慧萌宝大赛</a></h3>
              </div>
            </li>
            <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
              <div class="am-u-sm-4 am-list-thumb">          
                  <img src="http://img5.douban.com/lpic/o636459.jpg"/>
              </div>

              <div class=" am-u-sm-8 am-list-main">
                  <h3 class="am-list-item-hd"><a href="" class="">首届.智慧萌宝大赛</a></h3>
              </div>
            </li>

        </ul>
    </div>
   </div>  
    <!--搜索-->
    <div class="am-g">
      <div class="am-u-lg-6">
        <div class="am-input-group am-input-group-primary">
          <span class="am-input-group-btn">
            <button class="am-btn am-btn-primary" style="border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;" type="button"><span class="am-icon-search"></span></button>
          </span>
            <input type="text"  placeholder="输入编号或者名称" class="am-form-field" style="padding-right:5px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;">
        </div>
      </div>
    </div>
    <div>
<div data-am-widget="tabs" class="am-tabs am-tabs-default">
      <ul class="am-tabs-nav am-cf">
          <li class="am-active"><a href="[data-tab-panel-0]">青春</a></li>
          <li class=""><a href="[data-tab-panel-1]">彩虹</a></li>
      </ul>
      <div class="am-tabs-bd">
          <div data-tab-panel-0 class="am-tab-panel am-active">
            【青春】那时候有多好，任雨打湿裙角。忍不住哼起，心爱的旋律。绿油油的树叶，自由地在说笑。燕子忙归巢，风铃在舞蹈。经过青春的草地，彩虹忽然升起。即使视线渐渐模糊，它也在我心里。就像爱过的旋律，没人能抹去。因为生命存在失望，歌唱，所以才要歌唱。
          </div>
          <div data-tab-panel-1 class="am-tab-panel ">
            【彩虹】那时候有多好，任雨打湿裙角。忍不住哼起，心爱的旋律。绿油油的树叶，自由地在说笑。燕子忙归巢，风铃在舞蹈。经过青春的草地，彩虹忽然升起。即使视线渐渐模糊，它也在我心里。就像爱过的旋律，没人能抹去。因为生命存在失望，歌唱，所以才要歌唱。
          </div>
      </div>
  </div>
    </div>
        
    </div>
</body>
</html>
